<template>
	<div>
		<div class="btn">
			<div class="one">近一年</div>
			<div class="two">选择时间  ▼</div>
		</div>
		<div>
			<ul>
				<li>
					<div class="a1" @click="btn"> 
						<div>
							<div>
								牛韦<span>390090</span>
							</div>
							<div>
								<p>申请日期 2020-10-09</p>
							</div>
						</div>
						<div  class="b1">审核中</div>
					</div>
				</li>
				<li>
					<div class="a1" @click="btn"> 
						<div>
							<div>
								牛韦<span>390090</span>
							</div>
							<div>
								<p>申请日期 2020-10-09</p>
							</div>
						</div>
						<div  class="b2">已取消</div>
					</div>
				</li>
				<li>
					<div class="a1" @click="btn"> 
						<div>
							<div>
								牛韦<span>390090</span>
							</div>
							<div>
								<p>申请日期 2020-10-09</p>
							</div>
						</div>
						<div  class="b3">已寄出</div>
					</div>
				</li>
				<li>
					<div class="a1" @click="btn"> 
						<div>
							<div>
								牛韦<span>390090</span>
							</div>
							<div>
								<p>申请日期 2020-10-09</p>
							</div>
						</div>
						<div  class="b2">已取消</div>
					</div>
				</li>
				<li>
					<div class="a1" @click="btn"> 
						<div>
							<div>
								牛韦<span>390090</span>
							</div>
							<div>
								<p>申请日期 2020-10-09</p>
							</div>
						</div>
						<div  class="b3">已寄出</div>
					</div>
				</li>
				<li>
					<div class="a1" @click="btn"> 
						<div>
							<div>
								牛韦<span>390090</span>
							</div>
							<div>
								<p>申请日期 2020-10-09</p>
							</div>
						</div>
						<div  class="b1">审核中</div>
					</div>
				</li>
				<li>
					<div class="a1" @click="btn"> 
						<div>
							<div>
								牛韦<span>390090</span>
							</div>
							<div>
								<p>申请日期 2020-10-09</p>
							</div>
						</div>
						<div  class="b3">已寄出</div>
					</div>
				</li>
				<li>
					<div class="a1" @click="btn"> 
						<div>
							<div>
								牛韦<span>390090</span>
							</div>
							<div>
								<p>申请日期 2020-10-09</p>
							</div>
						</div>
						<div  class="b3">已寄出</div>
					</div>
				</li>
				<li>
					<div class="a1" @click="btn"> 
						<div>
							<div>
								牛韦<span>390090</span>
							</div>
							<div>
								<p>申请日期 2020-10-09</p>
							</div>
						</div>
						<div  class="b3">已寄出</div>
					</div>
				</li>
			</ul>
		</div>
	</div>
</template>

<script>
	export default {
		methods: {
			btn() {
				uni.navigateTo({
					url: "../../pages/apply/apply"
				})
			}
		}
	}
</script>

<style>
	.btn{
		line-height: 25px;
		font-size: 12px;
		margin: 0 ;
		padding: 0;
		border-radius: 20%;	
		display: flex;
		font-weight: 200;
		margin: 10px;
	}
	.btn div {
		padding: 0 15px;
		border-radius: 25px;
		margin: 0 10px;
	}

	.one {
		background-color: #006eff ;
		color: white;
	}	
	.two {
		background-color: #e4f0ff ;
		color: #006EFF;
	}
	ul{
		list-style: none;
		padding: 0;
		margin: 10px;
	}
	li{
		border-top: 1px solid #ebebeb;
		border-bottom: 1px solid #ebebeb;
		padding: 10px 0 ;
	}
	.a1{
		display: flex;
		justify-content: space-between;
		line-height: 30px;

	}
	.b1,.b2,.b3 {
		line-height: 60px;
	}
	.b1 {
		color: #5add94;
	}
	.b2 {
		color: #d8d8d8;
	}
	.b3 {
		color: #ff9946;
	}
	span,p{
		font-weight: 300;
	}
	p {
		font-size: 12px;
	}
	span {
		margin: 0 5px;
	}
</style>`